<page-header></page-header>
<nz-card>
  <!-- 提交成功 -->
  <result
    type="success"
    [title]="'{{ 'submit.success' | translate }}'"
    description="提交结果页用于反馈一系列操作任务的处理结果，如果仅是简单操作，使用 Message 全局提示反馈即可。本文字区域可以展示简单的补充说明，如果有类似展示x“单据”的需求，下面这个灰色区域可以呈现比较复杂的内容。"
    [extra]="resultExtra"
  >
    <ng-template #resultExtra>
      <div nz-row [nzGutter]="16" class="mb-md">
        <div nz-col [nzXs]="24" [nzSm]="12" [nzMd]="12" [nzLg]="12" [nzXl]="6">
          <!-- 项目 -->
          <span class="text-grey-darker">{{ 'project' | translate }} ID：</span>
          23421
        </div>
        <div nz-col [nzXs]="24" [nzSm]="12" [nzMd]="12" [nzLg]="12" [nzXl]="6">
          <!--负责人：  -->
          <span class="text-grey-darker">{{ 'depart.person.in.charge' | translate }}：</span>
          曲丽丽
        </div>
        <div nz-col [nzXs]="24" [nzSm]="24" [nzMd]="24" [nzLg]="24" [nzXl]="12">
          <!--生效时间：  -->
          <span class="text-grey-darker">{{ 'effect.time' | translate }}：</span>
          2016-12-12 ~ 2017-12-12
        </div>
      </div>
      <nz-steps [nzCurrent]="1" nzProgressDot>
        <!--  创建项目-->
        <nz-step [nzTitle]="'{{ 'create.object' | translate }}'" [nzDescription]="createDesc">
          <ng-template #createDesc>
            <div style="font-size: 14px; position: relative; left: 38px;">
              <div style="margin-top: 8px; margin-bottom: 4px;">
                曲丽丽
                <i nz-icon type="dingding" class="ml-sm"></i>
              </div>
              <div style="margin-top: 8px; margin-bottom: 4px;">2016-12-12 12:32</div>
            </div>
          </ng-template>
        </nz-step>
        <!-- 部门初审 -->
        <nz-step [nzTitle]="'{{ 'depart.first.trial' | translate }}'" [nzDescription]="checkedDesc">
          <ng-template #checkedDesc>
            <div style="font-size: 14px; position: relative; left: 38px;">
              <div style="margin-top: 8px; margin-bottom: 4px;">
                周毛毛
                <i nz-icon type="dingding" class="ml-sm" style="color: #00a0e9;"></i>
              </div>
              <div style="margin-top: 8px; margin-bottom: 4px;">
                <!--  催一下-->
                <a (click)="msg.success('click')">{{ 'hurry' | translate }}</a>
              </div>
            </div>
          </ng-template>
        </nz-step>
        <!-- 财务复核 -->
        <nz-step [nzTitle]="'{{ 'financial.review' | translate }}'"></nz-step>
        <!-- 完成 -->
        <nz-step [nzTitle]="'{{ 'cost.finish' | translate }}'"></nz-step>
      </nz-steps>
    </ng-template>
    <!-- 返回列表 -->
    <button nz-button [nzType]="'primary'">{{ 'return.lists' | translate }}</button>
    <!-- 查看项目 -->
    <button nz-button>{{ 'view.object' | translate }}</button>
    <!-- 打 印 -->
    <button nz-button>{{ 'menu.delon.print' | translate }}</button>
  </result>
</nz-card>
